<!DOCTYPE html>
<html lang="en" >
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <title>登录界面</title>
    <link rel="stylesheet"  href="../static/layui/css/layui.css">
    <link rel="stylesheet"  href="../static/css/login.css">
</head>
<body>
<form class="layui-form" onsubmit="returnsubmitFlag()" action="/loginIn" method="post">
    <div class="container">
        <div class="layui-form-item">
            <label class="layui-form-label">用户名</label>
            <div class="layui-input-block">
                <input type="text" onblur="checkUser()" onfocus="focusUser()" οnkeyup="this.value=this.value.replace(/[, ]/g,'')" id="name" name="name" required  lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input">
                <label id="userNullTip"></label>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">密 &nbsp;&nbsp;码</label>
            <div class="layui-input-inline">
                <input type="password" onBlur="checkPassword()" onfocus="focusPassword()" οnkeyup="this.value=this.value.replace(/[, ]/g,'')" id="password" name="password" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
                <label id="passwordNullTip"></label>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button id="login" class="layui-btn" lay-submit lay-filter="formDemo">登陆</button>
            </div>
        </div>
        <a href="" class="font-set">立即注册</a>
    </div>
</form>
<script  src="../static/layui/layui.js"></scriptth>
    <script  src="../static/layui/lay/modules/layer.js"></script>
    <script>
    var userFlag;//判断是否可以提交
    var userFlag=false;
    var passFlag=false;
    function checkUser() {//判断用户是否为空
        var userElement=document.getElementById("name"); //获得user输入标签
        var userNullTip=document.getElementById("userNullTip");  //获得提示标签
        if(userElement.value.length==0){
            userNullTip.innerHTML="<font color='red'>用户名不能为空！</font>";
        }else{
            userFlag=true;//成功执行下一步
        }
    }
    function focusUser(){
        var userNullTip=document.getElementById("userNullTip");
        userNullTip.innerHTML="";   //隐藏红色提示文字
        userFlag=false;
    }
    function checkPassword(){
        var passElement=document.getElementById("password");
        var passNullTip=document.getElementById("passwordNullTip");
        if(passElement.value.length==0){
            passNullTip.innerHTML="<font color='red'>密码不能为空！</font>";//设置红色提示内容
        }
        else{
            passFlag=true;
        }
    }
    function focusPassword(){
        var passNullTip=document.getElementById("passwordNullTip");
        passNullTip.innerHTML="";
        passFlag=false;
    }

</script>
</body>
</html>